<template>
	<div class="main">
		<Usernav />
		<div class="content">
			<div class="content-left">
				<router-link to="/upload" class="file">上传文件</router-link>
				<router-link to="/modellist" class="file">模型列表</router-link>
			</div>
			<div class="content-right">
				<router-view></router-view>
			</div>
		</div>
	</div>
  </template>
  
  <script setup>
  import Usernav from "../components/Usernav.vue";
  import { useRouter } from "vue-router";
  //要在进入页面时自动选择第一个，您可以使用生命周期挂钩以编程方式导航到路由。
  import { onBeforeMount } from "vue";
  
  const router = useRouter();
  
  onBeforeMount(() => {
  router.replace("/upload");
  });
  </script>
  
  <style scoped>
  .main {
  display: flex;
  flex-direction: column;
  height: 100vh;
  }
  .main .content {
  flex: 1;
  display: flex;
  padding: 1rem;
  overflow-y: auto;
  padding: 0px;
  text-align: center;
  }
  .content-left {
  width: 140px;
  height: 100%;
  background-color: rgb(238, 238, 238);
  }
  .file {
  text-decoration: none;
  display: inline-block;
  margin: 10px 0px 0px 0px;
  color: #000;
  padding: 5px 30px 5px 30px;
  }
  
  .file:focus,
  .file:hover {
  color: #007bff; /* Change this color to the desired color */
  background-color: 	#FFFFFF;
  }
  </style>
  